import React, { Component } from 'react';
import { List, InputItem, Toast } from 'antd-mobile';
import { withRouter } from 'react-router-dom';
import YwxNavBar from '../../components/common/YwxNavBar/YwxNavBar';
import './AuditDetail.less';

class AuditDetail extends Component {

    constructor(props) {
        super(props);
        this.state = {
            name: '',
            phone: '',
            commission: '',
            applyTime: '',
        }
        this.onSubmit = React.$utils.throttle(this.onSubmit, 2000)
        this.fetchData();
    };

    fetchData = () => {
        let id = this.props.match.params.id;
        React.$utils.request({
            url: '/app/commissionAudit/' + id,
        }).then(res => {
            this.setState({
                ...res
            })
        })
    };

    onMoneyChange = (value) => {
        this.setState({
            commission: value
        })
    };


    onSubmit = (auditStatus) => {

        let {
            commission
        } = this.state;

        commission = commission - 0;

        if (auditStatus && !commission) {
            Toast.fail('佣金应为非0数字');
            return false
        }

        let id = this.props.match.params.id;
        React.$utils.request({
            url: '/app/commissionAudit',
            method: 'post',
            data: {
                id,
                commission: commission,
                auditStatus
            }
        }).then(res => {
            Toast.success('审核成功', 2, () => {
                this.props.history.go(-1);
            })
        })
    }

    render() {
        const {
            name,
            phone,
            commission,
            applyTime,
        } = this.state
        return (
            <div className='audit-detail'>
                <YwxNavBar>佣金审核</YwxNavBar>
                <List>
                    <InputItem editable={false} value={name} >代理姓名</InputItem>
                    <InputItem editable={false} value={phone} >手机号码</InputItem>
                    <InputItem style={{ color: '#FA6F5C' }}
                        onChange={this.onMoneyChange} type='digit' value={commission} extra='元/单'>佣金价格</InputItem>
                    <InputItem editable={false} value={applyTime} >申请时间</InputItem>
                </List>
                <div className='footer-button-container'>
                    <div onClick={() => { this.onSubmit(false) }} className='button-item disagree'>拒绝请求</div>
                    <div onClick={() => { this.onSubmit(true) }} className='button-item agree'>同意提升</div>
                </div>
            </div >
        );
    }
}

export default withRouter(AuditDetail);